<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title> 会员日普惠活动二维码申领</title>
    <meta name="description"
          content="app, web app, responsive, admin dashboard, admin, flat, flat ui, ui kit, off screen nav">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/static/css/app.v1.css">
    <link rel="stylesheet" href="/static/css/font.css" cache="false">
</head>
<body>
<section class="hbox stretch"> <!-- .aside -->
    
    <!-- /.aside --> <!-- .vbox -->
    <section id="content">
        <section class="vbox">
            <header class="header bg-dark bg-gradient">
                <ul class="nav nav-tabs">
                    <li class="active"><a href="#wizard" data-toggle="tab"> 会员日普惠活动二维码申领</a></li>
                </ul>
            </header>
            <section class="scrollable wrapper">
                <div class="tab-content">
            
                    <section class="tab-pane active" id="wizard">
                        <div class="panel">
                            <div class="wizard clearfix" id="form-wizard">
                                <ul class="steps">
                                    <li data-target="#step1" class="active"><span
                                            class="badge badge-info">1</span>第一步
                                    </li>
                                </ul>
                            </div>
                            <div class="step-content">
                                <form>
                                    <div class="step-pane active" id="step1"><p>请输入单位名称</p>
                                        <input type="text" class="form-control" id="company_name"
                                               data-trigger="change" data-required="true"
                                               placeholder="请输入单位全称（注：如有括号，请与基础档案保持一致）">
                                        <label id="cmp_name_id"></label><br>
                                        <label>入口二维码：</label>
                                        <img id="cmp_img_id" width="300" height="300"/>
                                    </div>
                                </form>
                                <div class="actions m-t">
                                    <button type="button" class="btn btn-white btn-sm btn-next" onclick="create_prcode()">获取二维码
                                    </button>
                                    <button type="button" class="btn btn-white btn-sm btn-next" onclick="download_img()">下载图片
                                    </button>
                                </div>
                            </div>
                        </div>
                    </section>
                </div>
            </section>
        </section>
    </section>
</section>
<script src="/static/css/app.v1.js"></script>
<script src="/static/admin/js/vendor/jquery/jquery.min.js"></script>
<script>
    function download_img(){
        var rootpath='https://brilliantlife.com.cn:8090/'
        var img = document.getElementById('cmp_img_id'); // 获取要下载的图片
        var url = img.src;                            // 获取图片地址
        var a = document.createElement('a');          // 创建一个a节点插入的document
        var event = new MouseEvent('click')           // 模拟鼠标click点击事件
        a.download = document.getElementById("company_name").value; // 设置a节点的download属性值
        a.href = url;                                 // 将图片的src赋值给a节点的href
        a.dispatchEvent(event)                        // 触发鼠标点击事件
    }
    function readCookie(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for(var i=0;i < ca.length;i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1,c.length);
        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
    }
        return null;
    }

    function create_prcode(){
        var cmp_name = document.getElementById("company_name").value;
        var cmp_img = document.getElementById("cmp_img_id");
        cmp_name.innerText = cmp_name;
        cmp_img.src="../media/qrcode_image/"+cmp_name+".jpg";
    }
</script>
 </body>
</html>
